<template>
 <div id="a">
  <div class="b">
      <div class="bb">
        <img class="c" :src="img1" alt="">
      <span class="d">{{$route.meta.title}}</span>
      <div class="dd"></div>
      </div>
  </div>
  <div class="main">
      <div class="main-pic"><img src="../assets/images/orange.png" alt="" ></div>
    <div class="input-name">
    <input type="text" placeholder="手机号" v-model="userInfo.phone">
    </div> 
    <div class="input-name">
        <input type="password" placeholder="密码" v-model="userInfo.password">
    </div>
    
    <button @click="login">登录</button>
   <router-link  :to="{path:'/register'}" ><button>注册</button> </router-link>
    </div>
   
 </div>
 
</template>

<script>
import {Login} from '../util/request/api'
export default {
 data() {
 return {
     userInfo: {
        phone: "",
        password: "",
      },
    img1:require("../assets/images/white.png"),
 };
 },
 methods:{
     login(){
         if(this.userInfo.phone==''||this.userInfo.password==""){
             alert("用户名密码不能为空")
         }else{
            Login(this.userInfo).then(res=>{
                 if(res.data.code==200){
                     sessionStorage.setItem('isLogin',JSON.stringify(res.data.list))
                     this.$router.push("/usercenter")
                 }else{
                     alert(res.data.msg)
                 }
             })
         }
     }
 }
}
</script>

<style  scoped>
.input-name{
    text-align: center;
}
input{
 border: 0.5px solid #333;
}
button{
    background-color: rgb(255, 96, 63)!important;
}
</style>
